<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>小米官网</title>
    <link rel="stylesheet" href="http://localhost:2205/css/base.css">
    <link rel="stylesheet" href="http://localhost:2205/css/website.css">
    <link rel="stylesheet" href="http://localhost:2205/libs/swiper-bundle.min.css">
    <script src="http://localhost:2205/libs/jquery.min.js"></script>
    <script src="http://localhost:2205/libs/template-web.js"></script>
    <script src="http://localhost:2205/libs/swiper-bundle.min.js"></script>
</head>
<body>
    <header>
<!-- 顶部部分 -->
<div class="head_box">
    <div id="head_wrap">
        <div id="head_nav">
            <img class="logo" src="../img/logo-mi2.png" alt="">
            <a class="head_nav_a" href="http://localhost:2205/html/website.html">小米官网</a>
            <span class="line">|</span>
            <a class="head_nav_a" href="http://localhost:2205/index.html">小米商城</a>
            <span class="line">|</span>
            <a class="head_nav_a">MIUI</a>
            <span class="line">|</span>
            <a class="head_nav_a" href="http://localhost:2205/html/lot.html">loT</a>
            <span class="line">|</span>
            <a class="head_nav_a" href="http://localhost:2205/html/service.html">云服务</a>
            <span class="line">|</span>
            <a class="head_nav_a">天星数科</a>
            <span class="line">|</span>
            <a class="head_nav_a">有品</a>
            <span class="line">|</span>
            <a class="head_nav_a">小爱开放平台</a>
            <span class="line">|</span>
            <a class="head_nav_a">企业团购</a>
            <span class="line">|</span>
            <a class="head_nav_a">资质证照</a>
            <span class="line">|</span>
            <a class="head_nav_a">协议规则</a>
            <span class="line">|</span>
            <a class="head_nav_a">下载app</a>
            <span class="line">|</span>
            <a class="head_nav_a" id="Select_Region_but">SelectLocation</a>
        </div>
        <div id="head_right">
            <div id="head_landing">
                <a href="http://localhost:2205/html/login.html" id="login_a" class="head_nav_a">登陆</a>
                <span class="line">|</span>
                <a class="head_nav_a exit">退出</a>
            </div>
        </div>
    </div>
</div>
    </header>
    <main>
        <img class="a" src="http://localhost:2205/img/web-1.jpeg@base@tag=imgScale&F=webp&h=1080&q=90&w=1920" alt="">
      <!-- 轮播 -->
      <div class="swiper">
        <div class="swiper-wrapper">
            <div class="swiper-slide"><img src="http://localhost:2205/img/lunba-1.jpeg@base@tag=imgScale&F=webp&h=1080&q=90&w=1920" alt=""></div>
            <div class="swiper-slide"><img src="http://localhost:2205/img/lunba-2.jpeg@base@tag=imgScale&F=webp&h=1080&q=90&w=1920" alt=""></div>
            <div class="swiper-slide"><img src="http://localhost:2205/img/lunba-3.jpeg@base@tag=imgScale&F=webp&h=1080&q=90&w=1920" alt=""></div>
        
        </div>
        <!-- 如果需要分页器 -->
        <div class="swiper-pagination"></div>

        <!-- 如果需要导航按钮 -->
        <div class="swiper-button-prev"></div>
        <div class="swiper-button-next"></div>

        <!-- 如果需要滚动条 -->
        <div class="swiper-scrollbar"></div>
    </div>
    <!-- 轮播 -->
    <div class="swiper">
        <div class="swiper-wrapper">
            <div class="swiper-slide"><img src="http://localhost:2205/img/lunba-4.jpeg@base@tag=imgScale&F=webp&h=1080&q=90&w=1920" alt=""></div>
            <div class="swiper-slide"><img src="http://localhost:2205/img/lunba-5.jpeg@base@tag=imgScale&F=webp&h=1080&q=90&w=1920" alt=""></div>
            <div class="swiper-slide"><img src="http://localhost:2205/img/lunba-6.jpeg@base@tag=imgScale&F=webp&h=1080&q=90&w=1920" alt=""></div>
        
        </div>
        <!-- 如果需要分页器 -->
        <div class="swiper-pagination"></div>

        <!-- 如果需要导航按钮 -->
        <div class="swiper-button-prev"></div>
        <div class="swiper-button-next"></div>

        <!-- 如果需要滚动条 -->
        <div class="swiper-scrollbar"></div>
    </div>
    <!-- 轮播 -->
    <div class="swiper">
        <div class="swiper-wrapper">
            <div class="swiper-slide"><img src="http://localhost:2205/img/lunba-7.jpeg@base@tag=imgScale&F=webp&h=1080&q=90&w=1920" alt=""></div>
            <div class="swiper-slide"><img src="http://localhost:2205/img/lunba-8.jpeg@base@tag=imgScale&F=webp&h=1080&q=90&w=1920" alt=""></div>
        </div>
        <!-- 如果需要分页器 -->
        <div class="swiper-pagination"></div>

        <!-- 如果需要导航按钮 -->
        <div class="swiper-button-prev"></div>
        <div class="swiper-button-next"></div>

        <!-- 如果需要滚动条 -->
        <div class="swiper-scrollbar"></div>
    </div>
    <img src="http://localhost:2205/img/web-2.jpeg@base@tag=imgScale&F=webp&h=1080&q=90&w=1920" alt="">
    <img src="http://localhost:2205/img/web-3.png@base@tag=imgScale&F=webp&h=1093&q=90&w=1920" alt="">
    </main>
    <footer></footer>
    <script src="http://localhost:2205/js/website.js"> </script>
    <script>
          $('footer').load('http://localhost:2205/html/footer.html')
    </script>
</body>
</html>